<template>
  <div class="dashboard-editor-container">
    <!-- <github-corner class="github-corner"  margin-top:12px;  /> -->

    <!-- <el-row style="width: 86.3%; top: 6px; z-index: 999; position: fixed">
      <el-col :span="4.5" class="card-box">
        <el-cascader
          class="region"
          v-model="queryParams.salesGrade"
          placeholder="选择店铺分组"
          :options="cascadeList"
          :props="{ checkStrictly: true }"
          @change="handleChange"
          style="width: 300px; height: 30px"
        >
        </el-cascader>
      </el-col>
      <el-col :span="12">
        <nav id="navbar">
          <ul></ul>
        </nav>
      </el-col>
    </el-row> -->

    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      label-width="80px"
    >
      <el-select
        v-model="queryParams.talentId"
        placeholder="达人ID搜索"
        clearable
        filterable
      >
        <el-option
          v-for="(dict, i) in TalentNameList"
          :key="i"
          :label="dict.value"
          :value="dict.value"
        />
      </el-select>
      <el-select
        v-model="queryParams.talentName"
        placeholder="达人名称搜索"
        clearable
        filterable
      >
        <el-option
          v-for="(dict, i) in TalentNameList"
          :key="i"
          :label="dict.label"
          :value="dict.label"
        />
      </el-select>
      <el-button
        type="primary"
        icon="el-icon-search"
        size="mini"
        @click="handleQuery"
        >搜索</el-button
      >
      <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
        >重置</el-button
      >
    </el-form>

    <section id="section1">
      <el-row
        :gutter="10"
        style="
          margin-top: 20px;
          background: #fff;

          margin-bottom: 16px;
        "
      >
        <el-col :span="8">
          <el-card>
            <div
              slot="header"
              style="justify-content: space-between; display: flex"
            >
              <span><i class="el-icon-collection"></i> 达播概况</span>
            </div>
            <el-row>
              <el-col :span="10">
                <Card
                  :id="'year'"
                  :chartData="echartData"
                  height="270px"
                  width="100%"
                />
              </el-col>
              <el-col :span="1"><span></span></el-col>
              <el-col :span="13">
                <div
                  class="el-table el-table--enable-row-hover el-table--medium"
                  style="margin-top: 80px"
                >
                  <table cellspacing="0" style="width: 100%">
                    <tbody>
                      <tr>
                        <td class="el-table__cell is-leaf">
                          <div class="cell" style="font-weight: bold">
                            预估支出成本
                          </div>
                        </td>
                        <td class="el-table__cell is-leaf">
                          <div class="cell" style="font-weight: bold">
                            {{
                              biItem.estimateExpenditureCost
                                ? formatNumber(biItem.estimateExpenditureCost)
                                : "未更新"
                            }}
                          </div>
                        </td>
                      </tr>
                      <tr>
                        <td class="el-table__cell is-leaf">
                          <div class="cell" style="font-weight: bold">
                            带货合计金额
                          </div>
                        </td>
                        <td class="el-table__cell is-leaf">
                          <div class="cell" style="font-weight: bold">
                            {{
                              biItem.payAmount
                                ? formatNumber(biItem.payAmount)
                                : "未更新"
                            }}
                          </div>
                        </td>
                      </tr>
                      <tr>
                        <td class="el-table__cell is-leaf">
                          <div class="cell" style="font-weight: bold">
                            带货净值金额
                          </div>
                        </td>
                        <td class="el-table__cell is-leaf">
                          <div class="cell" style="font-weight: bold">
                            {{
                              biItem.netSaleAmount
                                ? formatNumber(biItem.netSaleAmount)
                                : "未更新"
                            }}
                          </div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </el-col>
            </el-row>
          </el-card>
        </el-col>
        <el-col :span="8">
          <el-card>
            <div
              slot="header"
              style="justify-content: space-between; display: flex"
            >
              <span
                ><i class="el-icon-collection"></i> 达人预估成本花费占比</span
              >
            </div>
            <div ref="usedmemory" style="height: 270px" />
          </el-card>
        </el-col>
        <el-col :span="8">
          <el-card>
            <div
              slot="header"
              style="justify-content: space-between; display: flex"
            >
              <span><i class="el-icon-collection"></i> 达人带货金额占比图</span>
            </div>
            <div ref="totalStock" style="height: 270px" />
          </el-card>
        </el-col>
      </el-row>
    </section>

    <section id="section2">
      <!-- margin-bottom: 16px -->
      <el-row :gutter="10" style="background: #fff; margin-bottom: 16px">
        <el-card>
          <div
            slot="header"
            style="justify-content: space-between; display: flex"
          >
            <span><i class="el-icon-collection"></i> 达人销售业绩报表</span>
            <span>
              <el-col :span="1.5">
                <el-button
                  type="warning"
                  plain
                  icon="el-icon-download"
                  size="mini"
                  @click="handleExport"
                  >导出</el-button
                >
              </el-col>
            </span>
          </div>
          <u-table
            :data="biNumberItem"
            :height="600"
            header-cell-class-name="table-header"
            row-class-name="table-row-low"
            border
            @sort-change="handleSortChange"
            :row-style="rowStyle"
            @cell-click="tableList"
          >
            <el-table-column
              label="时间"
              align="center"
              prop="dataDateUnit"
              width="160"
              fixed
            ></el-table-column>
            <u-table-column
              label="达人名称"
              align="center"
              prop="talentName"
              width="220"
              fixed
            ></u-table-column>
            <u-table-column
              label="洽谈佣金率"
              align="center"
              prop="discussCommissionRateStr"
              width="160"
            />
            <!-- <u-table-column sortable
              label="产品款号"
              align="center"
              prop="item"
            ></u-table-column> -->
            <u-table-column
              sortable
              label="带货总金额"
              align="center"
              prop="payAmount"
              :formatter="stateFormat"
              width="160"
            />
            <u-table-column
              sortable
              label="成交订单数 "
              align="center"
              prop="orderQuantityStr"
              width="160"
            ></u-table-column>
            <u-table-column
              sortable
              label="销售总件数"
              align="center"
              prop="productQuantity"
              width="160"
            />
            <u-table-column
              sortable
              label="退款总金额"
              align="center"
              prop="returnAmount"
              :formatter="stateFormat"
              width="160"
            />
            <u-table-column
              sortable
              label="净销售金额"
              align="center"
              prop="netSaleAmount"
              :formatter="stateFormat"
              width="160"
            />
            <u-table-column
              sortable
              label="预估佣金"
              align="center"
              prop="estimateCommission"
              :formatter="stateFormat"
              width="160"
            />
            <u-table-column
              label="预估佣金率"
              align="center"
              prop="estimateCommissionRateStr"
              width="160"
            />
            <u-table-column
              sortable
              label="摊销推广费用"
              align="center"
              prop="promotionCost"
              :formatter="stateFormat"
              width="160"
            >
              <template slot-scope="scope">
                <div
                  style="
                    color: rgb(37, 137, 255);
                    cursor: pointer;
                    text-decoration: underline;
                  "
                  @click="contact(scope.row)"
                >
                  {{ scope.row.promotionCost }}
                </div>
              </template>
            </u-table-column>
            <u-table-column
              sortable
              label="已结算佣金"
              align="center"
              prop="alreadyPaidCommission"
              width="160"
              :formatter="stateFormat"
            />
            <u-table-column
              sortable
              label="待结算佣金"
              align="center"
              prop="stayPaidCommission"
              width="160"
              :formatter="stateFormat"
            />
            <u-table-column
              sortable
              label="去除达人成本后预计毛利"
              align="center"
              prop="estimateGrossProfit"
              width="200"
              :formatter="stateFormat"
            />
          </u-table>
          <pagination
            v-show="objItemtotal > 0"
            :total="objItemtotal"
            :page.sync="objItem.pageNum"
            :limit.sync="objItem.thisPageSize"
            @pagination="getselectLiveTalentList"
          />
        </el-card>
      </el-row>
    </section>

    <section id="section2">
      <!-- margin-bottom: 16px -->
      <el-row :gutter="10" style="background: #fff; margin-bottom: 16px">
        <el-card>
          <div
            slot="header"
            style="justify-content: space-between; display: flex"
          >
            <span
              ><i class="el-icon-collection"></i
              >{{ this.talentrow.talentName + " " }} 达人销售业绩趋势</span
            >
            <span>
              <el-col :span="1.5">
                <el-button
                  type="warning"
                  plain
                  icon="el-icon-download"
                  size="mini"
                  @click="handleExportI"
                  >导出</el-button
                >
              </el-col>
            </span>
          </div>
          <chartDataI :chartData="echartDataI" />
        </el-card>
      </el-row>
    </section>

    <section id="section3">
      <!-- margin-bottom: 16px  @cell-click="tableList"-->
      <el-row :gutter="10" style="background: #fff; margin-bottom: 16px">
        <el-card>
          <div
            slot="header"
            style="justify-content: space-between; display: flex"
          >
            <span><i class="el-icon-collection"></i> 综合分析报表</span>
            <span>
              <el-col :span="1.5">
                <el-button
                  type="warning"
                  plain
                  icon="el-icon-download"
                  size="mini"
                  @click="handleExportSelf"
                  >导出</el-button
                >
              </el-col>
            </span>
          </div>
          <el-table
            :data="VoList"
            :height="500"
            style="width: 100%"
            header-cell-class-name="table-header"
            row-class-name="table-row-low"
            border
            @sort-change="handleSortVoList"
            @cell-click="tableEdit"
            :row-class-name="tableRowClassName"
          >
            <el-table-column
              label="时间"
              align="center"
              prop="dataDateUnit"
            ></el-table-column>
            <el-table-column
              label="达人名称"
              align="center"
              prop="talentName"
              width="220"
            ></el-table-column>
            <el-table-column
              label="合作状态"
              align="center"
              prop="cooperationStatus"
            ></el-table-column>
            <el-table-column label="合作产品款号" align="center" prop="item" />
            <el-table-column
              sortable
              label="产品售价"
              align="center"
              prop="salePrice"
            />
            <!-- <el-table-column sortable
              label="推广费 "
              align="center"
              prop="promotionAmount"
            ></el-table-column> -->
            <el-table-column
              sortable
              label="佣金率"
              align="center"
              prop="commissionRateStr"
            />
            <el-table-column
              sortable
              label="销售总件数"
              align="center"
              prop="productQuantity"
            />
            <el-table-column
              sortable
              label="净销售件数"
              align="center"
              prop="netProductQuantity"
            />
            <el-table-column
              sortable
              label="净销售GMV"
              align="center"
              prop="payAmount"
              :formatter="stateFormat"
            />
            <el-table-column
              sortable
              label="摊销推广费用"
              align="center"
              prop="promotionAmount"
            />
            <el-table-column
              sortable
              label="预估佣金支出"
              align="center"
              prop="estimateCommission"
              :formatter="stateFormat"
            />
          </el-table>
          <pagination
            v-show="objSelftotal > 0"
            :total="objSelftotal"
            :page.sync="objSelf.pageNum"
            :limit.sync="objSelf.thisPageSize"
            @pagination="getselectLiveTalentVoList"
          />
        </el-card>
      </el-row>
    </section>

    <section id="section2">
      <!-- margin-bottom: 16px -->
      <el-row :gutter="10" style="background: #fff; margin-bottom: 16px">
        <el-card>
          <div
            slot="header"
            style="justify-content: space-between; display: flex"
          >
            <span
              ><i class="el-icon-collection"></i
              >{{
                this.talentitem.talentName + " " + this.talentitem.item + " "
              }}
              综合分析趋势</span
            >
            <span>
              <el-col :span="1.5">
                <el-button
                  type="warning"
                  plain
                  icon="el-icon-download"
                  size="mini"
                  @click="handleExportII"
                  >导出</el-button
                >
              </el-col>
            </span>
          </div>
          <chartDataI :chartData="echartDataII" />
        </el-card>
      </el-row>
    </section>

    <el-dialog title="达人推广费用" :visible.sync="contactopen" append-to-body>
      <el-table :data="contactList">
        <el-table-column
          sortable
          label="达人ID"
          align="center"
          prop="talentId"
        />
        <el-table-column
          sortable
          label="达人昵称"
          align="center"
          prop="talentNickname"
        />
        <el-table-column
          sortable
          label="推广费发生日期"
          align="center"
          prop="date"
          width="160"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.date, "{y}-{m}-{d}") }}</span>
          </template>
        </el-table-column>
        <el-table-column
          sortable
          label="推广费用金额"
          align="center"
          prop="promotionCost"
        />
        <el-table-column
          sortable
          label="备注信息"
          align="center"
          prop="remark"
        />
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
import {
  listBiLiveOrder,
  getBiLiveOrder,
  delBiLiveOrder,
  addBiLiveOrder,
  updateBiLiveOrder,
  selectLiveVoStatistics,
  selectLiveData,
  selectLiveOrderSaleList,
  selectLiveSaleStatistics,
  selectLiveTalentList,
  selectLiveTalentVoList,
  talentPieChart,
  selectTalentNamelist,
  selectLiveTalentTend,
  selectLiveTalentVoTend,
} from "@/api/live/BiLiveOrder";
import {
  listTalentpromotioncosts,
  getTalentpromotioncosts,
  delTalentpromotioncosts,
  addTalentpromotioncosts,
  updateTalentpromotioncosts,
} from "@/api/live/talentpromotioncosts";
import { getCache } from "@/api/monitor/cache";
// import echarts from "echarts";
import * as echarts from "echarts/lib/echarts.js";
require("echarts/extension/bmap/bmap");
import "echarts/map/js/china.js"; //引入中国地图数据
import city from "echarts/map/json/china-cities.json";
import date from "./day/date.vue";
import chartDataI from "./components/chartDataI";
import chartDataII from "./components/chartDataII";
import chartDataIII from "./components/chartDataIII";
import chartDataIV from "./components/chartDataIV";
// import chartDataII from "./components/chartDataII";
import chartData from "./components/chartData";
import MixChart from "./Chart/MixChart.vue";
import timeSearch from "./day/day.vue";
import exhaustionDay from "./day/exhaustionDay.vue";

// import GithubCorner from '@/components/GithubCorner'
import PanelGroup from "./components/PanelGroup";
import PanelGroupI from "./components/PanelGroupI";
import PanelGroupII from "./components/PanelGroupII";
// import LineChart from './components/LineChart'
import chartDataRaddar from "./components/chartDataRaddar";
import RaddarChart from "./components/RaddarChart";
import PieChart from "./components/PieChart";
// import BarChart from './components/BarChart'
import { firstThreeScreenRank } from "@/api/sku/BiSkuSaleDwd";
import {
  numberOfItem,
  TopSaleProvince,
  synchroChannelData,
} from "@/api/chart/BiChannelSaleDwd";
import {
  selectChannelStatistics,
  selectSaleSingle,
  channelSaleTop,
  shopSaleTop,
  selectInventoryData,
  selectInvStatistics,
  getchannelInventoryTop,
  getshopInventoryTop,
  selectFirstStatistics,
  selectAllFirstThreeList,
} from "@/api/chart/SaleDwd";
import Card from "./Chart/card.vue";
import { listBrandChannelShop, listAll } from "@/api/chart/brandChannelShop";

const lineChartData = {};

export default {
  name: "Goods",
  dicts: [
    "sys_product_item",
    "sys_product_secondary",
    "sys_product_cycle",
    "sys_product_pl",
  ],
  props: {
    timeObj: {
      type: Object,
      default: () => {},
    },
    salesGrade: {
      type: Array,
      default: () => [],
    },
  },
  components: {
    Card,
    chartDataRaddar,
    // GithubCorner,
    PanelGroup,
    PanelGroupI,
    PanelGroupII,
    // LineChart,

    // RaddarChart,
    PieChart,
    // BarChart,

    chartData,
    chartDataI,
    chartDataII,
    chartDataIII,
    chartDataIV,
    MixChart,
    // TransactionTable,
    // TodoList,
    // BoxCard
    timeSearch,
    exhaustionDay,
    date,
  },
  data() {
    return {
      talentitem: {},
      talentrow: {},
      TalentNameList: [],
      //坑位费
      contactopen: false,
      contactList: [],
      //综合分析报表
      VoList: [],
      //统计渠道销售信息
      usedmemory: null,
      totalStock: null,
      dayActiveRate: 2,
      timeArrRate: [
        // { value: "1", label: "今天" },
        { value: "2", label: "售罄时间定义" },
        // { value: "7", label: "最近7天" },
        // { value: "30", label: "最近30天" },
      ],
      timeGapRate: { startSellOutDate: "", endSellOutDate: "" },
      //品类属性
      itemType: [
        { value: "salesAmount", label: "销售金额" },
        { value: "returnAmount", label: "退款金额" },
        // { value: "factory_order", label: "工厂订单" },
        // { value: "salesGrossProfit", label: "采购在途" },
        { value: "saleDays", label: "可售天数" },
        { value: "netSalesAmount", label: "净销售额" },
        { value: "totalSalesNumber", label: "总销售件数" },
        { value: "netSalesNumber", label: "净销售件数" },
        { value: "returnBeforeShipmentNumber", label: "发货前退货件数" },
        { value: "returnAfterShipmentNumber", label: "发货后退货件数" },
        { value: "totalReturnNumber", label: "总退货件数" },
        { value: "comprehensiveReturnRate", label: "综合退货率" },
        { value: "grossProfit", label: "毛利额" },
        { value: "grossProfitRate", label: "毛利率" },
        // { value: "endingInventory", label: "库存" },
        { value: "exhaustionRate", label: "售馨率" },
        { value: "sdNumber", label: "SD单件数" },
        { value: "mjxNumber", label: "MJX单件数" },
      ],
      //价格带
      list: [],
      //多选品类
      formData: {
        libraryIdList: [{ id: "" }],
      },
      libraryOptions: [
        // { value: "1", label: "库位1" },
        // { value: "2", label: "库位2" },
        // { value: "3", label: "库位3" },
        // { value: "4", label: "库位4" },
        // { value: "5", label: "库位5" },
        // { value: "6", label: "库位6" },
      ], // 库存名称列表

      //雷达图
      echartDataRaddar: [],
      //总览数据
      itemData: {},
      // 总条数
      total: 0,
      // 查询参数
      queryParams: {
        pageNum: 1,
        thisPageSize: 10,
        // talentId: "gymgirls",
        salesGrade: [],
        talentId: null,
        // property: "salesAmount",
        // firstLevelList: null,
        // secondLevelList: null,
        // threeLevelList: null,
      },
      biItem: {},
      //商品排行
      ItemDateList: [],
      //产品视角
      productView: "一级",
      //店铺SaleTop
      shopSaleTopList: [],
      //渠道SaleTop
      channelSaleTopList: [],
      //店铺库存Top
      shopInventoryTopList: [],
      //渠道库存Top
      channelInventoryTopList: [],
      // 统计店铺销售信息
      commandstats: null,
      //统计渠道销售信息
      usedmemory: null,
      // 统计店铺库存信息
      shoptotalStock: null,
      //统计渠道库存信息
      totalStock: null,
      //锚点
      sections: document.querySelectorAll("section"),
      activeSection: null,
      active: null,
      scrollTimer: null,
      //地区前20
      TopSallist: [],
      tableHeight: window.innerHeight - 175,
      pageHeight: window.innerHeight - 280,
      itemHeight: window.innerHeight - 680,
      shopListHeight: window.innerHeight - 570,
      //达播
      biNumberItem: [],
      objItem: {
        pageNum: 1,
        thisPageSize: 10,
      },
      objItemtotal: 0,
      //自播
      biNumberSelf: [],
      objSelf: {
        pageNum: 1,
        thisPageSize: 10,
      },
      objSelftotal: 0,

      //时间控件
      // timeObj: {},
      //客单价
      biNumberOfItem: {},

      //时间控件
      valueTime: new Date(new Date().setDate(new Date().getDate() - 1)),
      groupType: "date",

      highlighted: ["销售金额", "退款金额", "净销售额"], // 初始化时，前两个元素高亮

      //传递数据
      echartData: {
        columns: ["支付日期", "达播销售金额", "自播销售金额"],
        rows: [],
      },
      //传递数据
      echartDataI: {
        columns: ["支付日期", "达播成交订单数", "自播成交订单数"],
        rows: [],
      },
      //传递数据
      echartDataII: {
        columns: ["支付日期", "达播退款金额", "自播退款金额"],
        rows: [],
      },
      //传递数据
      echartDataIII: {
        columns: ["支付日期", "成交订单数"],
        rows: [],
      },
      //传递数据
      echartDataIV: {
        columns: ["支付日期", "销售金额"],
        rows: [],
      },
      highlightedSku: ["库存总金额", "产品库存总金额", "配件库存总金额"], // 初始化时，前两个元素高亮

      //Sku传递数据
      echartDataSku: {
        columns: ["支付日期", "库存总金额", "产品库存总金额", "配件库存总金额"],
        rows: [],
      },
      //时间
      //
      dayActive: 365,
      timeArr: [
        { value: "2", label: "昨天" },
        { value: "7", label: "最近7天" },
        { value: "30", label: "日" },
        { value: "56", label: "周" },
        { value: "365", label: "月" },
        { value: "1", label: "自定义" },
      ],
      timeGap: { startTime: "", endTime: "" },
      // 店铺
      cascadeList: [],
      // , "天猫", "vfu运动旗舰店"
      value: [],
      loading: false,
      //店铺名称
      shopName: "",
      mapData: [],
      lineChartData: lineChartData.newVisitis,
    };
  },
  created() {
    this.getList();

    // this.handleChangeTime()
    /** 查询品牌渠道店铺关系列表 */
    // this.getdataSourceList();
    this.getselectTalentNamelist();
    // this.openLoading();
  },

  mounted() {
    // this.$store.dispatch("app/toggleSideBarHide", fa);
  },
  watch: {
    productView: {
      handler: function (newnew, oldold) {
        console.log(JSON.stringify(newnew));
        this.list = [];
        this.formData = {
          libraryIdList: [{ id: "" }],
        };
        //  this.chinaConfigure();
        // this.chinaConfigure();
        // this.$nextTick(() => {
        //   this.$refs.platform.echarts.resize();
        // });
      },
      deep: true,
      immediate: true,
    },
    timeObj: {
      handler: function (newnew, oldold) {
        this.handleChangeTime();
      },
      deep: true,
      immediate: true,
    },
    salesGrade: {
      handler: function (newnew, oldold) {
        this.queryParams.salesGrade = this.salesGrade;

        this.handleChangeTime(this.timeObj);
      },
      deep: true,
      immediate: true,
    },
  },
  mounted() {
    window.addEventListener("scroll", this.startScrollTimer);
  },
  beforeDestroy() {
    window.removeEventListener("scroll", this.startScrollTimer);
  },

  methods: {
    tableRowClassName({ row, rowIndex }) {
      // return "font-weight: bold;";
      if (row.talentName === "汇总") {
        return "highlight-row";
      } else {
        return "";
      }
    },
    formatNumber(number) {
      // 将数字保留两位小数，并转为字符串
      const numberStr = number.toFixed(2);

      // 分割整数部分和小数部分
      const [integerPart, decimalPart] = numberStr.split(".");

      // 将整数部分按千分位分隔
      const integerPartWithCommas = integerPart.replace(
        /\B(?=(\d{3})+(?!\d))/g,
        ","
      );

      // 拼接整数部分和小数部分
      return integerPartWithCommas + "." + (decimalPart || "00");
    },
    rowStyle({ row, rowIndex }) {
      // return "font-weight: bold;";
      if (rowIndex == this.biNumberItem.length - 1) {
        return " position: sticky;bottom: 0;font-weight: bold;";
      } else {
        return "";
      }
    },
    //坑位费点击
    contact(row) {
      listTalentpromotioncosts({
        talentId: row.talentId,
        // ...this.timeObj,
        startTime: this.timeObj.startTime,
        endTime: this.timeObj.endTime,
      }).then((response) => {
        this.contactList = response.rows ? response.rows : [];
        this.contactopen = true;
      });
    },

    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      // this.getList();
      // console.log(JSON.stringify(this.queryParams));
      // if (!this.queryParams.itemType) {
      //   this.$modal.msgError("请选择产品视角");
      //   return;
      // }
      this.handleChange();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParams.talentId = "";
      this.queryParams.talentName = "";
      this.handleQuery();
    },
    //店铺控件
    handleChange(val) {
      console.log(JSON.stringify(val));

      // var lastElement = val.pop();
      // this.shopName = lastElement

      // console.log(this.dayActive);
      // let obj = { salesGrade: this.value.join(","), ...this.timeObj };
      // console.log(JSON.stringify(obj));
      // this.objItem = {
      //   liveType: "达播",
      //   salesGrade: this.value.join(","),
      //   ...this.timeObj,
      //   pageNum: this.objItem.pageNum,
      //   thisPageSize: this.objItem.thisPageSize,
      // };
      // this.objSelf = {
      //   liveType: "自播",
      //   salesGrade: this.value.join(","),
      //   ...this.timeObj,
      //   pageNum: this.objSelf.pageNum,
      //   thisPageSize: this.objSelf.thisPageSize,
      // };
      // localStorage.removeItem("result");
      // localStorage.setItem("result", JSON.stringify(obj));

      this.queryParams.startTime = this.timeObj.startTime;
      this.queryParams.endTime = this.timeObj.endTime;
      this.queryParams.dateType = this.timeObj.dateType;

      if (!this.queryParams.endTime) {
        return;
      }
      // else if (obj.dateType == "date" || obj.dateType == "daterange") {
      //   //销售指标
      //   this.getselectSaleSingle(obj);
      //   this.getselectLiveVoStatistics(obj);
      //   return;
      //   // console.log("库存接口");
      //   //渠道库存Top
      //   this.channelInventoryTop(obj);
      //   //店铺库存Top
      //   this.shopInventoryTop(obj);
      //   //曲线
      //   this.getechartChannelData(obj);

      //   //渠道SaleTop
      //   this.getchannelSaleTop(obj);
      //   //店铺SaleTop
      //   this.getshopSaleTop(obj);
      //   //sku曲线
      //   this.getechartSkuData(obj);
      //   //sku指标
      //   this.getselectSkuSingle(obj);
      //   //商品排行Top
      //   this.changeView();
      // }
      else {
        this.objSelf.pageNum = 1;
        this.objItem.pageNum = 1;
        this.getselectLiveTalentList();
        this.getselectLiveTalentVoList();
        this.gettalentPieChart();

        return;
        //销售指标
        this.getselectSaleSingle(obj);
        this.getselectLiveVoStatistics(obj);
        //达播
        this.getselectLiveOrderSaleList(this.objItem);
        //自播
        this.getselectLiveOrderSaleList(this.objSelf);

        //渠道库存Top
        this.channelInventoryTop(obj);
        //店铺库存Top
        this.shopInventoryTop(obj);
        //曲线
        this.getechartChannelData(obj);
        //销售指标
        this.getselectSaleSingle(obj);
        //渠道SaleTop
        this.getchannelSaleTop(obj);
        //店铺SaleTop
        this.getshopSaleTop(obj);
        //商品排行Top
        this.changeView();
      }
      let param = {
        dataSource: this.value,
        startTime: this.dateFormat(this.timeObj.startTime),
        endTime: this.dateFormat(this.timeObj.endTime),
        dataType: this.groupType,
      };
      console.log(JSON.stringify(param));
      if (!param.endTime) {
        return;
      } else {
        // this.getechartChannelData(obj)
        this.getnumberOfItem(param);
        this.getTopSal(param);
      }
    },
    //选完时间后发请求
    handleChangeTime(timeObj) {
      // console.log(type)
      // console.log(timeObj)
      // TODO
      // this.timeObj = timeObj;
      // let param = {
      //   dataSource: this.value,
      //   startTime: this.dateFormat(timeObj.startTime),
      //   endTime: this.dateFormat(timeObj.endTime),
      //   dataType: this.groupType,
      // };
      // console.log(JSON.stringify(param));
      this.queryParams.startTime = this.timeObj.startTime;
      this.queryParams.endTime = this.timeObj.endTime;
      this.queryParams.dateType = this.timeObj.dateType;
      // if (!param.endTime) {
      //   return;
      // } else {
      //   // this.getechartChannelData(obj)
      //   //客件数
      //   this.getnumberOfItem(param);
      //   //地区Top20
      //   this.getTopSal(param);
      // }
      // if (this.cascadeList.length < 1) {
      //   return;
      // }
      if (this.queryParams.salesGrade.length < 1) {
        return;
      }
      console.log(JSON.stringify(this.timeObj));
      // let obj = { salesGrade: this.value.join(","), ...timeObj };
      // this.objItem = {
      //   liveType: "达播",
      //   salesGrade: this.value.join(","),
      //   ...timeObj,
      //   pageNum: this.objItem.pageNum,
      //   thisPageSize: this.objItem.thisPageSize,
      // };
      // this.objSelf = {
      //   liveType: "自播",
      //   salesGrade: this.value.join(","),
      //   ...timeObj,
      //   pageNum: this.objSelf.pageNum,
      //   thisPageSize: this.objSelf.thisPageSize,
      // };

      // console.log(JSON.stringify(obj));

      // localStorage.removeItem("result");
      // localStorage.setItem("result", JSON.stringify(obj));

      if (!this.queryParams.endTime) {
        return;
      }
      // else if (obj.dateType == "date" || obj.dateType == "daterange") {
      //   //销售指标
      //   this.getselectSaleSingle(obj);
      //   this.getselectLiveVoStatistics(obj);
      //   return;
      //   // console.log("库存接口");
      //   //渠道库存Top
      //   this.channelInventoryTop(obj);
      //   //店铺库存Top
      //   this.shopInventoryTop(obj);
      //   //曲线
      //   this.getechartChannelData(obj);
      //   //销售指标
      //   this.getselectSaleSingle(obj);
      //   //渠道SaleTop
      //   this.getchannelSaleTop(obj);
      //   //店铺SaleTop
      //   this.getshopSaleTop(obj);
      //   //sku曲线
      //   this.getechartSkuData(obj);
      //   //sku指标
      //   this.getselectSkuSingle(obj);
      //   //商品排行Top
      //   this.changeView();
      // }
      else {
        this.objSelf.pageNum = 1;
        this.objItem.pageNum = 1;
        this.getselectLiveTalentList();
        this.getselectLiveTalentVoList();
        this.gettalentPieChart();
        this.getselectTalentNamelist();

        return;
        //销售指标
        this.getselectSaleSingle(obj);
        this.getselectLiveVoStatistics(obj);
        //达播
        this.getselectLiveOrderSaleList(this.objItem);
        //自播
        this.getselectLiveOrderSaleList(this.objSelf);

        //渠道库存Top
        this.channelInventoryTop(obj);
        //店铺库存Top
        this.shopInventoryTop(obj);
        //曲线
        this.getechartChannelData(obj);
        //销售指标
        this.getselectSaleSingle(obj);
        //渠道SaleTop
        this.getchannelSaleTop(obj);
        //店铺SaleTop
        this.getshopSaleTop(obj);
        //商品排行Top
        this.changeView();
      }
    },
    getselectTalentNamelist() {
      // this.openLoading();
      selectTalentNamelist(this.queryParams).then((response) => {
        // this.TalentNameList = [];
        let TalentNameList = [];
        response.forEach((item) => {
          // count++;
          TalentNameList.push({
            value: item.talentId,
            // value: count,
            label: item.talentName,
          });
        });
        this.TalentNameList = TalentNameList;
        // this.$modal.closeLoading();
      });
    },
    gettalentPieChart() {
      talentPieChart(this.queryParams).then((response) => {
        if (response) {
          //饼图
          let list = [];
          response.slice(0, 10).forEach((item) => {
            list.push({
              name:
                item.talentName + "(" + item.talentCostRatio.toFixed(2) + "%)",
              value: item.talentCostRatio,
            });
          });

          // this.$modal.closeLoading();

          this.usedmemory = echarts.init(this.$refs.usedmemory, "macarons");
          this.usedmemory.setOption({
            // title: {
            //   text: "标题文本", // 主标题文本
            //   left: "center", // 标题位置，默认为 'left'
            // },
            tooltip: {
              trigger: "item",
              // ({d}%)
              formatter: "{a} <br/>{b} ",
            },
            // legend: {
            //   left: "center",
            //   bottom: "10",
            //   data: ["达人总支出占比"],
            // },
            series: [
              {
                name: "达人总支出占比",
                type: "pie",
                // roseType: "radius",
                radius: [15, 95],
                center: ["50%", "38%"],
                data: list,
                animationEasing: "cubicInOut",
                animationDuration: 1000,
              },
            ],
          });

          //饼图
          let price = [];
          response.slice(0, 10).forEach((item) => {
            price.push({
              name:
                item.talentName +
                "(" +
                item.talentOutlayCostRatio.toFixed(2) +
                "%)",
              value: item.talentOutlayCostRatio,
            });
          });

          // this.$modal.closeLoading();

          this.totalStock = echarts.init(this.$refs.totalStock, "macarons");
          this.totalStock.setOption({
            // title: {
            //   text: "标题文本", // 主标题文本
            //   left: "center", // 标题位置，默认为 'left'
            // },
            tooltip: {
              trigger: "item",
              // ({d}%)
              formatter: "{a} <br/>{b} ",
            },
            // legend: {
            //   left: "center",
            //   bottom: "10",
            //   data: ["达人带货金额占比图"],
            // },
            series: [
              {
                name: "达人带货金额占比",
                type: "pie",
                // roseType: "radius",
                radius: [15, 95],
                center: ["50%", "38%"],
                data: price,
                animationEasing: "cubicInOut",
                animationDuration: 1000,
              },
            ],
          });
        }
      });
    },
    handleSortChange(column) {
      /**
  排序方向 asc 升序 desc 降序
 
private String orderDirection;*/
      switch (column.order) {
        case "ascending":
          this.queryParams.isAsc = "true";
          break;
        case "descending":
          this.queryParams.isAsc = "false";
          break;
        default:
          this.queryParams.isAsc = null;
          break;
      }
      this.queryParams.property = column.prop; //查询字段是表格中字段名字
      // this.queryParams.orderDirection = column.order;//动态取值排序顺序

      this.getselectLiveTalentList();
    },
    getselectLiveTalentList() {
      selectLiveTalentList({ ...this.queryParams, ...this.objItem }).then(
        (response) => {
          this.biItem = response.data[response.data.length - 1];

          this.echartData = {
            value: 0,
            name: "",
            bg: "",
          };
          this.echartData.value = this.biItem.talentCostAmountRatio
            ? this.biItem.talentCostAmountRatio
            : 0;
          this.echartData.name = "达人-预估支出成本占比";
          this.echartData.bg = "#2ba245";
          this.biNumberItem = response.data ? response.data : [];
          this.objItemtotal = response.totalCount;
          if (response.data) {
            this.tableList(response.data[0]);
          }
        }
      );
    },
    handleSortVoList(column) {
      /**
  排序方向 asc 升序 desc 降序
 
private String orderDirection;*/
      switch (column.order) {
        case "ascending":
          this.queryParams.isAsc = "true";
          break;
        case "descending":
          this.queryParams.isAsc = "false";
          break;
        default:
          this.queryParams.isAsc = null;
          break;
      }
      this.queryParams.property = column.prop; //查询字段是表格中字段名字
      // this.queryParams.orderDirection = column.order;//动态取值排序顺序

      this.getselectLiveTalentVoList();
    },
    getselectLiveTalentVoList() {
      selectLiveTalentVoList({ ...this.queryParams, ...this.objSelf }).then(
        (response) => {
          this.VoList = response.data ? response.data : [];
          this.objSelftotal = response.totalCount;
          if (response.data) {
            this.tableEdit(response.data[0]);
          }
        }
      );
    },
    //达播
    tableList(row, column, cell, event) {
      this.openLoading();
      console.log(JSON.stringify(row));
      console.log(JSON.stringify(this.queryParams));
      this.talentrow = {
        ...this.queryParams,
        talentId: row.talentId,
        talentName: row.talentName,
      };
      selectLiveTalentTend(this.talentrow).then((response) => {
        this.$modal.closeLoading();
        if (response) {
          this.echartDataI.columns = [
            "支付日期",
            "带货总金额",
            "成交订单数",
            "销售总件数",
            "退款总金额",
            "净销售金额",
            "预估佣金",
            "摊销推广费用",
            "已结算佣金",
            "待结算佣金",
            "去除达人成本后预计毛利",
          ];
          var row = [];
          response.forEach((item) => {
            row.push({
              支付日期: item.dataDateUnit,
              带货总金额: item.payAmount,
              成交订单数: item.orderQuantityStr,
              销售总件数: item.productQuantity,
              退款总金额: item.returnAmount,
              净销售金额: item.netSaleAmount,
              预估佣金: item.estimateCommission,
              摊销推广费用: item.promotionCost,
              // 自播销售金额: item.payAmount,
              已结算佣金: item.alreadyPaidCommission,
              待结算佣金: item.stayPaidCommission,
              去除达人成本后预计毛利: item.estimateGrossProfit,
            });
          });
          this.echartDataI.rows = row;
        }
      });
      // this.objItem.item = row.item;
      // this.getselectLiveSaleStatistics(this.objItem);
    },
    //综合
    tableEdit(row, column, cell, event) {
      console.log(JSON.stringify(row));
      console.log(JSON.stringify(this.queryParams));
      this.talentitem = {
        ...this.queryParams,
        talentld: row.talentld,
        talentName: row.talentName,
        item: row.item,
      };
      this.$modal.closeLoading();
      selectLiveTalentVoTend(this.talentitem).then((response) => {
        this.$modal.closeLoading();
        if (response) {
          this.echartDataII.columns = [
            "支付日期",
            "产品售价",
            "佣金率",
            "销售总件数",
            "净销售件数",
            "净销售GMV",
            "摊销推广费用",
            "预估佣金支出",
          ];
          // "已结算佣金",
          //   "待结算佣金",
          //   "去除达人成本后预计毛利",
          var row = [];
          response.forEach((item) => {
            row.push({
              支付日期: item.dataDateUnit,
              产品售价: item.salePrice,
              佣金率: item.commissionRate,
              销售总件数: item.productQuantity,
              净销售件数: item.netProductQuantity,
              净销售GMV: item.payAmount,
              摊销推广费用: item.promotionAmount,
              预估佣金支出: item.estimateCommission,

              // 自播销售金额: item.payAmount,
              // 已结算佣金: item.alreadyPaidCommission,
              // 待结算佣金: item.stayPaidCommission,
              // 去除达人成本后预计毛利: item.estimateGrossProfit,
            });
          });
          this.echartDataII.rows = row;
        }
      });
    },
    getselectLiveSaleStatistics(obj) {
      selectLiveSaleStatistics(obj).then((response) => {
        if (response) {
          // this.itemData = response;
          var row = [];
          var rowI = [];
          // var rowII = [];
          response.forEach((item) => {
            row.push({
              支付日期: item.dataDateUnit,
              成交订单数: item.orderQuantity,
              // 自播销售金额: item.payAmount,
            });
            rowI.push({
              支付日期: item.dataDateUnit,
              销售金额: item.payAmount,
              // 自播成交订单数: item.orderQuantity,
            });
            // rowII.push({
            //   支付日期: item.dataDateUnit,
            //   达播退款金额: item.talentReturnAmount,
            //   自播退款金额: item.returnAmount,
            // });
          });
          this.echartDataIII.rows = row;
          this.echartDataIV.rows = rowI;
          // this.echartDataII.rows = rowII;
        }
      });
    },
    //表格
    getselectLiveOrderSaleList(obj) {
      selectLiveOrderSaleList(obj).then((response) => {
        if (obj.liveType == "达播") {
          this.biNumberItem = response.data;
          this.objItemtotal = response.totalCount;
        } else if (obj.liveType == "自播") {
          this.biNumberSelf = response.data;
          this.objSelftotal = response.totalCount;
        }
      });
    },
    /**
     * 合并行 - 书架
     */
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      // const { timetableBookVO } = this.detailData;
      const timetableBookVO = this.biNumberItem;
      const listMap = {};
      timetableBookVO.length &&
        timetableBookVO.forEach((item, index) => {
          if (listMap[item.talentName]) {
            // len - 用于书架合并多少行
            listMap[item.talentName].len += 1;
            // firstIndex - 用于同一个书架，最开始的书架进行合并，例如书架1，有3本书，则第一本书的书架1合并3行，后面都为0即可
            listMap[item.talentName].firstIndex =
              listMap[item.talentName].firstIndex < index
                ? listMap[item.talentName].firstIndex
                : index;
          } else {
            listMap[item.talentName] = { len: 1, firstIndex: index };
          }
        });
      if (columnIndex == 0) {
        if (
          listMap[row.talentName] &&
          listMap[row.talentName].firstIndex == rowIndex
        ) {
          return { rowspan: listMap[row.talentName].len, colspan: 1 };
        } else {
          return { rowspan: 0, colspan: 0 };
        }
      }
    },
    //销售指标
    getselectSaleSingle(obj) {
      selectLiveData(obj).then((response) => {
        // if (response) {
        this.biNumberOfItem = response ? response : {};
        console.log(JSON.stringify(this.biNumberOfItem));
        // }
      });
    },
    //销售趋势图
    getselectLiveVoStatistics(obj) {
      selectLiveVoStatistics(obj).then((response) => {
        // console.log(JSON.stringify(response));
        if (response) {
          // this.itemData = response;
          var row = [];
          var rowI = [];
          var rowII = [];
          response.forEach((item) => {
            row.push({
              支付日期: item.dataDateUnit,
              达播销售金额: item.talentPayAmount,
              自播销售金额: item.payAmount,
            });
            rowI.push({
              支付日期: item.dataDateUnit,
              达播成交订单数: item.talentOrderQuantity,
              自播成交订单数: item.orderQuantity,
            });
            rowII.push({
              支付日期: item.dataDateUnit,
              达播退款金额: item.talentReturnAmount,
              自播退款金额: item.returnAmount,
            });
          });
          this.echartData.rows = row;
          this.echartDataI.rows = rowI;
          this.echartDataII.rows = rowII;
        }
      });
    },
    //分页
    //售罄时间定义
    changePage() {
      //请求数据
      let obj = {
        salesGrade: this.value.join(","),
        ...this.timeObj,
        itemType: this.productView,
        dataType: this.groupType,
        ...this.queryParams,
        ...this.timeGapRate,
      };
      firstThreeScreenRank(obj).then((response) => {
        this.ItemDateList = response.data;
        this.total = response.total;
      });
    },
    //视图角度
    changeView(val) {
      //请求前初始化
      // const Raddar = echarts.init(this.$refs.Raddar);
      // Raddar.dispose();
      this.queryParams.firstLevelList = null;
      this.queryParams.secondLevelList = null;
      this.queryParams.threeLevelList = null;
      this.formData = {
        libraryIdList: [{ id: "" }],
      };
      //请求数据
      let obj = {
        salesGrade: this.value.join(","),
        ...this.timeObj,
        itemType: this.productView,
        dataType: this.groupType,
        ...this.queryParams,
        ...this.timeGapRate,
      };
      firstThreeScreenRank(obj).then((response) => {
        this.ItemDateList = response.data;
        this.total = response.total;

        // || this.productView == "三级"
        if (response.total == 0) {
          const E = echarts.init(this.$refs.echarts);
          E.dispose();
        } else {
          // this.radarData.rows = response.data.slice(0, 2);
          let note = [];
          const keyArray = response.data.map((item) => item.itemGrade);

          response.data.forEach((item, index) => {
            if (index > 2) {
              return;
            }
            //多对一
            this.formData.libraryIdList.forEach((person) => {
              if (person.id == "") {
                this.formData.libraryIdList.splice(0, 1);
              }
              // m.push(item.id);
            });
            this.formData.libraryIdList.push({ id: item.itemGrade });

            //
            note.push({
              name: item.itemGrade,
              type: "bar",
              // step: "start",
              data: [
                item.firstPriceRangeNum,
                item.secondPriceRangeNum,
                item.thirdPriceRangeNum,
                item.fourthPriceRangeNum,
                item.fifthPriceRangeNum,
                item.sixthPriceRangeNum,
                item.seventhPriceRangeNum,
                item.eighthPriceRangeNum,
                // `${person.firstPriceRangeNum}, ${person.secondPriceRangeNum},${person.thirdPriceRangeNum}, ${person.fourthPriceRangeNum},${person.fifthPriceRangeNum}, ${person.sixthPriceRangeNum},${person.seventhPriceRangeNum}, ${person.eighthPriceRangeNum}`,
              ],
              // date: item.itemGrade,
              // firstPriceRangeNum: item.firstPriceRangeNum,
              // secondPriceRangeNum: item.secondPriceRangeNum,
              // thirdPriceRangeNum: item.thirdPriceRangeNum,
              // fourthPriceRangeNum: item.fourthPriceRangeNum,
              // fifthPriceRangeNum: item.fifthPriceRangeNum,
              // sixthPriceRangeNum: item.sixthPriceRangeNum,
              // seventhPriceRangeNum: item.seventhPriceRangeNum,
              // eighthPriceRangeNum: item.eighthPriceRangeNum,
            });
          });
          console.log(JSON.stringify(note));

          const option = {
            grid: {
              left: "5%",
              top: "10%",
              right: "3%",
              bottom: "10%",
            },
            // 提示框
            tooltip: { trigger: "axis" },
            xAxis: {
              type: "category",
              data: [
                "100以下",
                "[100,150)",
                "[150,200)",
                "[200,250)",
                "[250,300)",
                "[300,350)",
                "[350,400)",
                "400以上",
              ],
            },
            yAxis: { type: "value" },
            legend: {
              data: keyArray,
            },
            series: note,
          };

          // this.echartData.order.xData = xData;
          // this.echartData.order.series = series;
          const Raddar = echarts.init(this.$refs.Raddar);

          Raddar.setOption(option);
        }
        this.selectFirstStatisticsEchartsII();

        // console.log(JSON.stringify(this.ItemDateList));
      });
    },

    // 时间格式转换
    dateFormat(date) {
      date = new Date(date);
      let Y = date.getFullYear() + "-";
      let M =
        (date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1) + "-";
      let D = date.getDate() < 10 ? "0" + date.getDate() : date.getDate() + "";
      return Y + M + D;
    },
    /** 查询品牌渠道店铺关系列表 */
    getdataSourceList() {
      listAll().then((response) => {
        // response.data = [
        //     { channel: '抖音', shopName: 'VFU抖一抖店-抖音', brand: 'VFU' },
        //     { channel: '抖音', shopName: 'VFU-抖音小店', brand: 'VFU' },
        //     { channel: '头条放心购', shopName: 'VFU-头条放心购', brand: 'VFU' },
        //     { channel: '拼多多', shopName: 'VFU-拼多多', brand: 'VFU' },
        //     { channel: '微信', shopName: 'VFU-微店', brand: 'VFU' },
        //     { channel: '微信', shopName: 'VFU-微信商城', brand: 'VFU' },
        //     { channel: '小红书', shopName: 'VFU-小红书', brand: 'VFU' },
        //     { channel: '严选', shopName: 'VFU-严寻合作', brand: 'VFU' },
        //     { channel: '天猫', shopName: 'VFU运动旗舰店', brand: 'VFU' },
        //     { channel: '京东', shopName: 'VFU运动旗舰店-京东', brand: 'VFU' }
        // ];
        // const result = [];
        let list = [];
        response.forEach((item) => {
          if (item.isTalentLive == "是") {
            list.push(item);
          }
        });
        let result = this.transformData(list);
        this.queryParams.salesGrade = [
          result[0].label,
          // result[0].children[0].label,
          // result[0].children[0].children[0].label,
        ];
        this.cascadeList = result;
        this.handleChange();
      });
    },
    //店铺渠道品牌转换

    transformData(data) {
      let result = [];

      data.forEach((item) => {
        let brand = item.brand;
        let channel = item.channel;
        // let shopName = item.channelShopName;

        // 如果brand在结果数组中不存在，则创建一个新的数组
        let brandIndex = result.findIndex(
          (brandObj) => brandObj.label === brand
        );
        if (brandIndex === -1) {
          result.push({
            label: brand,
            value: brand,
            children: [],
          });
          brandIndex = result.length - 1;
        }

        // 如果channel在当前brand的children数组中不存在，则创建一个新的数组
        let channelIndex = result[brandIndex].children.findIndex(
          (channelObj) => channelObj.label === channel
        );
        if (channelIndex === -1) {
          result[brandIndex].children.push({
            label: channel,
            value: channel,
            // children: [],
          });
          channelIndex = result[brandIndex].children.length - 1;
        }

        // 如果shopName在当前channel的children数组中不存在，则创建一个新的数组
        // let shopIndex = result[brandIndex].children[
        //   channelIndex
        // ].children.findIndex((shopObj) => shopObj.label === shopName);
        // if (shopIndex === -1) {
        //   result[brandIndex].children[channelIndex].children.push({
        //     label: shopName,
        //     value: shopName,
        //     // children: []
        //   });
        // }
      });

      return result;
    },
    /** 导出按钮操作 */
    handleExportI() {
      delete this.talentrow.pageNum;
      delete this.talentrow.thisPageSize;
      this.download(
        "live/BiLiveOrder/liveTalentTendExport",
        {
          ...this.talentrow,
        },
        `达人销售业绩趋势报表_${new Date().getTime()}.xlsx`
      );
    },
    /** 导出按钮操作 */
    handleExportII() {
      delete this.talentitem.pageNum;
      delete this.talentitem.thisPageSize;
      this.download(
        "live/BiLiveOrder/liveTalentVoTendExport",
        {
          ...this.talentitem,
        },
        `综合分析趋势报表_${new Date().getTime()}.xlsx`
      );
    },
    /** 导出按钮操作 */
    handleExportSelf() {
      this.download(
        "live/BiLiveOrder/liveTalentVoExport",
        {
          ...this.queryParams,
          ...this.objSelf,
        },
        `综合分析报表_${new Date().getTime()}.xlsx`
      );
    },
    handleExport() {
      this.download(
        "live/BiLiveOrder/liveTalentExport",
        {
          ...this.queryParams,
          ...this.objItem,
        },
        `达人销售报表_${new Date().getTime()}.xlsx`
      );
    },
    /** 查缓存询信息 */
    getList() {},
    // 打开加载层
    openLoading() {
      this.$modal.loading("正在加载数据，请稍候！");
    },
  },
};
</script>
<style lang="scss" >
/* 添加你想要的特定行的CSS样式 */
.highlight-row {
  position: sticky;
  bottom: 0;
  font-weight: bold;
}
</style>
<style lang="scss" scoped>
/* 移除默认的列表样式 */
ul {
  margin-top: 0.4%;
  list-style-type: none;
  /* 设置弹性布局，使列表项横向排列 */
  display: flex;
  /* 添加一些内边距和背景颜色 */
  // padding: 10px;
  margin-right: 10px;
  /* 设置边框和圆角 */
  // border: 1px solid #ddd;
  border-radius: 5px;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
}

/* 设置列表项样式 */
li {
  /* 添加一些内边距和右边距 */
  // padding: 10px;
  margin-right: 10px;
  /* 设置链接文本样式 */
  font-size: 15px;
  color: #bbb;
  text-decoration: none;
}

li.active a {
  // color: #f00;
  /* 高亮颜色 */
  color: #fff;
  background-color: #40c9c6;
}

// section {
//   margin-top: 60px;
// }

.dashboard-editor-container {
  // padding: 16px;
  // background-color: rgb(240, 242, 245);
  position: relative;

  .github-corner {
    position: absolute;
    top: 0px;
    border: 0;
    right: 0;
  }

  .chart-wrapper {
    background: #fff;

    margin-bottom: 16px;
  }
}

@media (max-width: 1024px) {
  .chart-wrapper {
    padding: 8px;
  }
}
</style>
<style>
.el-scrollbar__wrap {
  /* overflow-x: hidden; */
  /* overflow-y: hidden; */
}
</style>
/** item *
@Excel(name ="产品款号")
private string item;
/** 带货总金额 */
@Excel(name ="带货总金额")
private Double payAmount;
/** 成交订单数 */
@Excel(name ="成交订单数")
private Integer orderQvantity:
/** 销售件数 */
@Excel(name =“销售件数”)
private Integer productQuantity;
/** 退款金额 *
@Excel(name ="退款金额"
private Double returnAmount;
/** 净销售额 */
@Excel(name =“净销售额")
private Double netSaleAmount;
/** 预估佣金 */
@Excel(name =“预估佣金”
private Double estimatecommission;
/** 坑位费 */
@Excel(name =“坑位费"
private Double promotioncost;
/** 已结算佣金 */
@Excel(name =“已结算佣金")
private Double alreadyPaidcommission;
/** 待结算佣金 */
@Excel(name =“待结佣余"
orivate DoublestavPaidcommission:
/** 去除达人成本后预计毛利 */@Excel(name =“预计毛利")private Double estimateGrossProfit;
/** 预估支出成本 */@Excel(name =“预估支出成本")private Double estimateTalentCost:
/** 预信支出成本总额 */private Double estimateExpenditureCost;
//达人占总金额的成本比private Double talentCostAmountRatio;
//达人占总达人花费占比private Double talentCostRatio;


ata
blic class BiliveTalentVo {
/** 品牌 */
@Excel(name =“品牌”
private String brand;
/** 渠道 */
@Excel(name =“道")
private string channel;
/** 店铺 */
@Excel(name =“店铺")
private String shopName;
/** item */
@Excel(name =“产品款号")private string item;
/** 达人名称 */
@Excel(name =“达人名称")private String talentName;
/** 达入ID */
@Excel(name ="达人ID")
private String talentId;
/** 合作状态 */
@Excel(name =“合作状态")
private String cooperationStatus;
/** 佣金率 */
@Excel(name =“佣金率")
private Double commissionRate:
/** 产品售价 */
@Excel(name =“产品售价”
private Double salePrice;
/** 推广费 */
@Excel(name ="推广”)private Double promotionAmount;
/** 销售GMV */@Excel(name ="销售GMV")private Double payAmount;
/** 预估佣金支出 */@Excel(name =“预估佣金支出")private Double estimateCommission;